<style>
.{{$t|escape:'html'}}_image_button {
  cursor: pointer;
}
table.{{$t|escape:'html'}}_list {
  border-left: 1px solid #dddddd;
  border-top: 1px solid #dddddd;
  margin-bottom: 1px;
  font-size: 11px;
}
table.{{$t|escape:'html'}}_list td.border {
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
}
table.{{$t|escape:'html'}}_list th {
  text-align: left;
  height: 35px;
  background-color: #eaf2f5;
  padding: 5px 0 5px 10px; 
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
}
table.{{$t|escape:'html'}}_list tr.drop td {
  padding-left: 0;
  border-right: 0;
  border-bottom: 0;
}
table.{{$t|escape:'html'}}_list tr.hi td {
  padding-left: 10px;
  height: 35px;
  background-color: #ff8000;
  border-right: 1px solid #ff8000;
  border-bottom: 1px solid #ff8000;
  cursor: move;
}
table.{{$t|escape:'html'}}_list tr.rowodd td {
  padding-left: 10px;
  height: 35px;
  background-color: #eeeeee;
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
}
table.{{$t|escape:'html'}}_list tr.roweven td {
  padding-left: 10px;
  height: 35px;
  border-right: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
}
table.{{$t|escape:'html'}}_list tr.rowodd:hover td {
  background-color: #f4f3b2;
}
table.{{$t|escape:'html'}}_list tr.roweven:hover td {
  background-color: #f4f3b2;
}
</style>

<table id="{{$t|escape:'html'}}_pages" class="{{$t|escape:'html'}}_list" cellPadding="0" cellSpacing="0">
  <tr>
    <td style="height: 35px;padding-left: 10px;"><input id="{{$t|escape:'html'}}_pages_select" type="checkbox"></input></td>
    <td class="border" style="padding-left: 10px;border-bottom: 0;" colSpan=5>
      <table>
        <tr>
          <td><select id="{{$t|escape:'html'}}_pages_actions"><option>{{t escape='html'}}Actions...{{/t}}</option></select></td>
          <td>
            <span class="image_button" style="width: 140px;" onclick="location.href='admin.php?t=pagecreate';">
              <table>
                <tr>
                  <td><img src="image/btn/add.png"></img></td>
                  <td>{{t escape='html'}}New Page{{/t}}</td>
                </tr>
              </table>
            </span>
          </td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <th width="50px"></th>
    <th width="400px">{{t escape='html'}}Name{{/t}}</th>
    <th width="300px">{{t escape='html'}}Link{{/t}}</th>
    <th width="60px">{{t escape='html'}}Home{{/t}}</th>
    <th width="60px">{{t escape='html'}}Menu{{/t}}</th>
    <th width="150px"></th>
  </tr>
</table>

<script src="jsrequest.php?script={{$t|escape:'html'}}" type="text/javascript"></script>
<script type="text/javascript">
  <!--
    if (document.addEventListener) {
      document.addEventListener('DOMContentLoaded', init, false);
    }
    window.onload = init;

    var _mRoot = JSON.parse('{{$msg|escape:javascript}}')['m'];
    var _mTable = document.getElementById('{{$t|escape:'html'}}_pages');
    var _mCount;
    var _move = null;
    var _mTd = null;
    var _mSpan = null;
    var _y = 0;
    var _mark = 0;
    var _selects = [];
    
    function init() {
      if (!document.getElementById || !document.createElement || !arguments || arguments.callee._loaded) {
        return;
      }
      arguments.callee._loaded = true;
      
      document.body.onmouseup = function(ev) {
        ev = (ev) ? ev : window.event;
        if (!_move) {
          return;
        }
        
        var tmp = MiscUtils.clone(_move);
        
        _move = null;
        _mCount = 0;
        setPages(_mRoot, []);
        
        new RequestUtils()._write(JSON.stringify( [ {
          n : 'pz_menu',
          a : [ tmp ],
          r : []
        } ]), function(result, params) {
          //location.reload();
        }, {
          pos : [ ev.clientX, ev.clientY ]
        });
      };
      
      _mCount = 0;
      setPages(_mRoot, []);
      if (_mRoot.c.length == 0) {
        tr = _mTable.insertRow(-1);
        tr.className = 'roweven';
        td = tr.insertCell(-1);
        td.colSpan = 6;
        td.appendChild(document.createTextNode('No Results Found'));
      }
      
      var select, actions;
      select = document.getElementById('{{$t|escape:'html'}}_pages_select');
      select.onclick = function() {
        for (var idx in  _selects) {
          var obj = _selects[idx];
          obj.checked = this.checked;
        }
      };
      actions = document.getElementById('{{$t|escape:'html'}}_pages_actions');
      actions.options[actions.options.length] = new Option('Delete');
      actions.onchange = function() {
        if (this.selectedIndex == 1) {
          var deletes = [];
          for (var idx in  _selects) {
            var obj = _selects[idx];
            if (obj.checked) {
              deletes[deletes.length] = obj._obj;
            }
          }
          new RequestUtils()._custom('delete_pages', JSON.stringify(deletes), function(result, params) {
            location.reload();
          }, {
            php: 'custom.php',
            pos : DOMUtils.findPos(this)
          });
        }
      };
    }
    
    function setPages(node, nums) {
      var tr, td, elm;
      
      if (node.id > 0) {
        tr = _mTable.insertRow(-1);
        if (_move && (node.id == _move.id || PIDTreeUtils.isSuccessor(_move, node))) {
          tr.className = 'hi';
          td = tr.insertCell(-1);
          td.style.borderLeft = '1px solid #000000';
          if (node.id == _move.id) {
            td.style.borderTop = '1px solid #000000';
            if (_move.c.length == 0) {
              td.style.borderBottom = '1px solid #000000';
            }
          } else {
            if (PIDTreeUtils.isLastChild(_move, node.id)) {
              td.style.borderBottom = '1px solid #000000';
            }
          }
          
          td = tr.insertCell(-1);
          td.style.borderRight = '1px solid #000000';
          td.colSpan = 6;
          elm = getPosSpan(nums);
          td.appendChild(elm);
          td.appendChild(document.createTextNode(node.name));
          if (node.id == _move.id) {
            _mSpan = elm;
            _mTd = td;
            _mark = MiscUtils.unique();
            setTimeout('setOpts(\'' + _mark + '\');', 750);
            
            td.style.borderTop = '1px solid #000000';
            if (_move.c.length == 0) {
              td.style.borderBottom = '1px solid #000000';
            }
          } else {
            if (PIDTreeUtils.isLastChild(_move, node.id)) {
              td.style.borderBottom = '1px solid #000000';
            }
          }
        } else {
          tr.className = (_mCount % 2 == 1) ? 'rowodd' : 'roweven';
          td = tr.insertCell(-1);
          elm = document.createElement('input');
          elm.type = 'checkbox';
          elm._obj = node;
          _selects.push(elm);
          td.appendChild(elm);
          
          td = tr.insertCell(-1);
          td.appendChild(getPosSpan(nums));
          td.appendChild(document.createTextNode(node.name));
          updateCell(node, td);
          
          td = tr.insertCell(-1);
          td.appendChild(document.createTextNode('http://{{$smarty.const.DOMAIN|escape:'javascript'}}{{$smarty.const.PATH|escape:'javascript'}}?i=' + node.id));
          
          td = tr.insertCell(-1);
          elm = document.createElement('input');
          elm.type = 'radio';
          elm.name = 'homepage';
          elm.checked = (node.is_default == 1);
          elm.onclick = function() {
            node.is_default = (this.checked) ? 1 : 0;
            new RequestUtils()._custom('homepage', JSON.stringify(node), function(result, params) {
//              location.reload();
            }, {
              pos : DOMUtils.findPos(this)
            });
          };
          td.appendChild(elm);
          
          td = tr.insertCell(-1);
          elm = document.createElement('input');
          elm.type = 'checkbox';
          elm.checked = node.appear_in_menu == 1;
          elm.onclick = function() {
            node.appear_in_menu = (this.checked) ? 1 : 0;
            new RequestUtils()._write(JSON.stringify( [ {
              n : 'pz_menu',
              a : [ node ],
              r : []
            } ]), function(result, params) {
//              location.reload();
            }, {
              pos : DOMUtils.findPos(this)
            });
          };
          td.appendChild(elm);
          
          td = tr.insertCell(-1);
          elm = document.createElement('img');
          elm.src = 'image/edit.png';
          
          elm.style.cursor = 'pointer';
          elm.onclick = function() {
            location.href = '?t=page&i=' + node.id;
          };
          td.appendChild(elm);
          
          _mCount++;
        }
      } else {
        DOMUtils.removeTableRows(_mTable, 2);
      }
      
      for (var idx in node.c) {
        var obj = node.c[idx];
        nums.push(parseInt(idx, 10) + 1);
        setPages(obj, nums);
        nums.pop();
      }
    }
    
    function getPosSpan(nums) {
      var str = '(';
      var span = document.createElement('span');
      span.style.color = '#000000';
      span.style.marginLeft = Math.max(nums.length - 1, 0) * 20 + 'px';
      span.style.marginRight = '10px';
      for (var idx in nums) {
        str += nums[idx];
        if (idx < nums.length - 1) {
          str += ' - ';
        }
      }
      str += ')';
      span.appendChild(document.createTextNode(str));
      return span;
    }
    
    function updateCell(obj, td) {
      td.style.cursor = 'move';
      td._obj = obj;
      td.onmousedown = function(ev) {
        ev = (ev) ? ev : window.event;
        _move = this._obj;
        _y = ev.clientY;
        
        _mCount = 0;
        setPages(_mRoot, []);
        
        _x = ev.clientX;
      };
      td.onmouseover = function(ev) {
        ev = (ev) ? ev : window.event;
        if (_move) {
          if (this._obj.c.length == 0 || (ev.clientY - _y < 0)) {
            var family = PIDTreeUtils.getFamily(_mRoot, this._obj);
            if (ev.clientY - _y < 0) {
              if (family.olderBro) {
                _move.order = this._obj.order - ((this._obj.order - family.olderBro.order) / 2);
              } else {
                _move.order = this._obj.order - 1;
              }
            } else {
              if (family.youngerBro) {
                _move.order = parseFloat(this._obj.order, 10) + ((family.youngerBro.order - this._obj.order) / 2);
              } else {
                _move.order = parseFloat(this._obj.order, 10) + 1;
              }
            }
            _move.parent_id = this._obj.parent_id;
          } else {
            _move.order = this._obj.c[0].order - 1;
            _move.parent_id = this._obj.id;
          }
          PIDTreeUtils.update(_mRoot);
          _y = ev.clientY;
          
          _mark = MiscUtils.unique();
          
          _mCount = 0;
          setPages(_mRoot, []);
        }
      };
    }
    
    function setOpts(mark) {
      if (mark != _mark || !_move) {
        return;
      }
      
      var family = PIDTreeUtils.getFamily(_mRoot, _move);
      if (family.olderBro) {
        _move.parent_id = family.olderBro.id;
        if (family.olderBro.c.length > 0) {
          _move.order = parseFloat(family.olderBro.c[family.olderBro.c.length - 1].order, 10) + 1;
        }
      } else {
        var startPoint = getStartPoint(_move, _move); 
        if (startPoint) {
          _move.parent_id = startPoint.parent_id;
          var parentFamily = PIDTreeUtils.getFamily(_mRoot, startPoint);
          if (parentFamily.youngerBro) {
            _move.order = parseFloat(startPoint.order, 10) + ((parentFamily.youngerBro.order - startPoint.order) / 2);
          } else {
            _move.order = parseFloat(startPoint.order, 10) + 1;
          }
        }
      }
      PIDTreeUtils.update(_mRoot);
      
      _mCount = 0;
      setPages(_mRoot, []);
    }
    
    function getStartPoint(node, end) {
      var family = PIDTreeUtils.getFamily(_mRoot, node);
      if (family.ancestors.length > 0) {
        var parentFamily = PIDTreeUtils.getFamily(_mRoot, node);
        if (!family.youngerBro) {
          return getStartPoint(family.ancestors[family.ancestors.length - 1], end);
        } else {
          if (node.id == end.id) {
            return null;
          }
          return node;
        }
      }
      return node;
    }
  // -->
</script>